<template>
  <MenuList :custom="custom" :menus="menuDatas" v-if="!Loading"> </MenuList>
</template>

<script>
import MenuList from './menuList'
import { treeToFlat } from '@/views/menuList/menus'
import { mapState } from 'vuex'
export default {
  components: { MenuList },
  data() {
    return {
      Loading: true,
      menuDatas: []
    }
  },
  props: {
    custom: {
      type: Array,
      default: () => []
    }
  },
  computed: {
    ...mapState(['menuList'])
  },
  watch: {
    menuList(newValue, oldValue) {
      this.dealMenu(newValue)
    }
  },
  mounted() {
    if (!this.menuList || this.menuList.length == 0) {
      this.$store.dispatch('getMenuList')
    } else {
      this.dealMenu(this.menuList)
    }
  },
  methods: {
    dealMenu(menuList) {
      const menu = treeToFlat(menuList).filter(item => item.path == this.$route.path)
      if (menu && menu.length > 0) {
        this.menuDatas = menu[0].children
        this.Loading = false
      } else {
        console.log('去中台挂载path')
      }
    }
  }
}
</script>
